<template>
    <div class="waybill-search-container">
        <el-form :model="ruleForm" ref="ruleForm" label-width="100px" class="demo-ruleForm">
            <div class="operation-buttons">
                <el-popconfirm confirm-button-text='好的' cancel-button-text='不用了' icon="el-icon-info" icon-color="red"
                    title="这是一段内容确定删除吗？">
                    <el-button slot="reference">批量操作</el-button>
                </el-popconfirm>
                <el-popconfirm confirm-button-text='好的' cancel-button-text='不用了' icon="el-icon-info" icon-color="red"
                    title="这是一段内容确定导入吗？">
                    <el-button slot="reference"> 导入 </el-button>
                </el-popconfirm>
                <el-button type="primary" @click="exportExcel()"> 导出 </el-button>
                <el-popconfirm confirm-button-text='好的' cancel-button-text='不用了' icon="el-icon-info" icon-color="red"
                    title="这是一段内容确定打印吗？">
                    <el-button slot="reference"> 打印 </el-button>
                </el-popconfirm>
            </div>
            <el-form-item label="运单状态">
                <el-select v-model="ruleForm.status" placeholder="全部">
                    <el-option label="待接单" value="待接单"></el-option>
                    <el-option label="待提货" value="待提货"></el-option>
                    <el-option label="待发车" value="待发车"></el-option>
                    <el-option label="已提货" value="已提货"></el-option>
                    <el-option label="运输中" value="运输中"></el-option>
                    <el-option label="待签收" value="待签收"></el-option>
                    <el-option label="已完成" value="已完成"></el-option>
                    <el-option label="已取消" value="已取消"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="运输方式">
                <el-select v-model="ruleForm.smid" placeholder="请选择">
                    <el-option v-for="s in ShippingMethods" :key="s.id" :label="s.transportMode"
                        :value="s.id"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="始发地" prop="origin">
                <el-cascader v-model="originSelected" :options="pcaTextArr" @change="handleOriginChange">
                </el-cascader>
            </el-form-item>
            <el-form-item label="目的地" prop="destination">
                <el-cascader v-model="destinationSelected" :options="pcaTextArr" @change="handleDestinationChange">
                </el-cascader>
            </el-form-item>
            <el-form-item label="下单日期">
                <el-col :span="11">
                    <el-form-item prop="placementTime1">
                        <el-date-picker type="datetime" value-format="yyyy-MM-dd HH:mm:ss" placeholder="选择日期"
                            v-model="ruleForm.placementTime1" style="width: 100%;"></el-date-picker>
                    </el-form-item>
                </el-col>
                <el-col class="line" :span="2">-</el-col>
                <el-col :span="11">
                    <el-form-item prop="placementTime2">
                        <el-date-picker type="datetime" value-format="yyyy-MM-dd HH:mm:ss" placeholder="选择日期"
                            v-model="ruleForm.placementTime2" style="width: 100%;"></el-date-picker>
                    </el-form-item>
                </el-col>
            </el-form-item>
            <el-form-item>
                <el-input placeholder="请输入关键词搜索" v-model="ruleForm.waybillId"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="getAll('ruleForm')">搜索</el-button>
                <el-button @click="resetForm('ruleForm')">重置</el-button>
            </el-form-item>
        </el-form>
        <el-table ref="multipleTable" :data="tableData" tooltip-effect="dark" style="width: 100%"
            @selection-change="handleSelectionChange">
            <el-table-column type="selection" width="55">
            </el-table-column>
            <el-table-column prop="waybillId" label="运单号">
            </el-table-column>
            <el-table-column prop="origin" label="始发地">
            </el-table-column>
            <el-table-column prop="destination" label="目的地">
            </el-table-column>
            <el-table-column prop="status" label="运单状态">
            </el-table-column>
            <el-table-column prop="transportMode" label="运输方式">
            </el-table-column>
            <el-table-column prop="carrier" label="承运商">
            </el-table-column>
            <el-table-column prop="driverName" label="司机">
            </el-table-column>
            <el-table-column prop="driverPhone" label="手机号码">
            </el-table-column>
            <el-table-column prop="licensePlate" label="车牌号">
            </el-table-column>
            <el-table-column prop="vehicleModel" label="车型">
            </el-table-column>
            <el-table-column label="计划发车时间" prop="plannedDepartureTime">
            </el-table-column>
            <el-table-column label="实际发车时间" prop="actualDepartureTime">
            </el-table-column>
            <el-table-column label="计划到达时间" prop="plannedArrivalTime">
            </el-table-column>
            <el-table-column label="实际到达时间" prop="actualArrivalTime">
            </el-table-column>
            <el-table-column label="接单时间" prop="orderTime">
            </el-table-column>
            <el-table-column label="下单时间" prop="placementTime">
            </el-table-column>
            <el-table-column label="创建时间" prop="creationTime">
            </el-table-column>
            <el-table-column prop="vehicleLength" label="车长">
            </el-table-column>
            <el-table-column prop="billingMethod" label="计费方式">
            </el-table-column>
            <el-table-column prop="totalFreight" label="运费合计">
            </el-table-column>
            <el-table-column prop="creator" label="创建人">
            </el-table-column>
            <el-table-column fixed="right" label="操作" width="100">
                <template slot-scope="scope">
                    <el-button @click="Update(scope.row)" type="text" size="small">编辑</el-button>
                    <el-button @click="toXiangQing(scope.row)" type="text" size="small">详情</el-button>
                    <el-button @click="toRetern(scope.row.id)" type="text" size="small">取消调度</el-button>
                </template>
            </el-table-column>
        </el-table>
        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="pageNum"
            :page-sizes="[10, 20, 30, 40]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper"
            :total="total">
        </el-pagination>
        <el-dialog :title="form.id == null ? '手动调度' : '手动调度'" :visible.sync="dialogFormVisible" width="60%">
            <el-form :model="form" :rules="rules">
                <p>基础信息</p>
                <el-divider></el-divider>
                <el-form-item label="运单号">
                    <el-input placeholder="请填写运单号" v-model="form.waybillId"></el-input>
                </el-form-item>
                <el-form-item label="运输方式">
                    <el-select v-model="form.transportMode" placeholder="请选择">
                        <el-option v-for="s in ShippingMethods" :key="s.id" :label="s.transportMode"
                            :value="s.id"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="始发地" prop="origin">
                    <el-cascader v-model="form.origin" :options="pcaTextArr" @change="handleDialogOriginChange">
                    </el-cascader>
                </el-form-item>
                <el-form-item label="目的地" prop="destination">
                    <el-cascader v-model="form.destination" :options="pcaTextArr"
                        @change="handleDestinationChange"></el-cascader>
                </el-form-item>
                <p>承运商</p>
                <el-divider></el-divider>
                <el-form-item label="承运商名称">
                    <el-select v-model="form.cid" placeholder="请选择">
                        <el-option v-for="c in Carrier" :key="c.id" :label="c.carrier" :value="c.id"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="联系人姓名">
                    <el-input placeholder="请填写" v-model="form.carrierContactName"></el-input>
                </el-form-item>
                <el-form-item label="手机号码">
                    <el-input placeholder="请填写" v-model="form.carrierContactPhone"></el-input>
                </el-form-item>
                <el-form-item label="司机姓名">
                    <el-select v-model="form.did" placeholder="请选择">
                        <el-option v-for="d in Driver" :key="d.id" :label="d.driverName" :value="d.id"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="手机号码">
                    <el-input placeholder="请填写" v-model="form.driverPhone"></el-input>
                </el-form-item>
                <el-form-item label="车牌号">
                    <el-select v-model="form.vid" placeholder="请选择">
                        <el-option v-for="v in Vehicle" :key="v.id" :label="v.licensePlate" :value="v.id"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="车型">
                    <el-select v-model="form.vid" placeholder="请选择">
                        <el-option v-for="v in Vehicle" :key="v.id" :label="v.vehicleModel" :value="v.id"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="车长">
                    <el-select v-model="form.vid" placeholder="请选择">
                        <el-option v-for="v in Vehicle" :key="v.id" :label="v.vehicleLength" :value="v.id"></el-option>
                    </el-select>
                </el-form-item>
                <p>货物信息</p>
                <el-divider></el-divider>
                <el-table :data="tableData" style="width: 100%">
                    <el-table-column prop="id" label="序号">
                    </el-table-column>
                    <el-table-column prop="waybillId" label="订单编号">
                    </el-table-column>
                    <el-table-column prop="origin" label="始发地">
                    </el-table-column>
                    <el-table-column prop="destination" label="目的地">
                    </el-table-column>
                    <el-table-column prop="cargoName" label="货物名称">
                    </el-table-column>
                    <el-table-column prop="quantity" label="数量">
                    </el-table-column>
                    <el-table-column prop="volume" label="体积（m3）">
                    </el-table-column>
                    <el-table-column prop="weight" label="重量（kg）">
                    </el-table-column>
                    <el-table-column prop="sharedFreight" label="分摊运费（元）">
                    </el-table-column>
                    <el-table-column prop="loadingUnloadingFee" label="装卸费（元）">
                    </el-table-column>
                    <el-table-column prop="packagingFee" label="包装费（元）">
                    </el-table-column>
                </el-table>
                <el-form-item label="总数量">
                    <el-input placeholder="请填写" v-model="form.totalQuantity"></el-input>
                </el-form-item>
                <el-form-item label="总体积">
                    <el-input placeholder="请填写" v-model="form.totalVolume"></el-input>
                </el-form-item>
                <el-form-item label="总重量">
                    <el-input placeholder="请填写" v-model="form.totalWeight"></el-input>
                </el-form-item>
                <el-form-item label="计费方式">
                    <el-select v-model="form.billingMethod" placeholder="请选择">
                        <el-option label="按件计费" value="按件计费"></el-option>
                        <el-option label="按重量计费" value="按重量计费"></el-option>
                        <el-option label="按体积计费" value="按体积计费"></el-option>
                        <el-option label="按车计费" value="按车计费"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="运费成本">
                    <el-input placeholder="请填写" v-model="form.freightCost"></el-input>
                </el-form-item>
                <el-form-item label="装卸费">
                    <el-input placeholder="请填写" v-model="form.goodsName"></el-input>
                </el-form-item>
                <el-form-item label="包装费">
                    <el-input placeholder="请填写" v-model="form.goodsName"></el-input>
                </el-form-item>
                <el-form-item label="其他费用">
                    <el-input placeholder="请填写" v-model="form.otherFees"></el-input>
                </el-form-item>
                <el-form-item label="运费合计">
                    <el-input placeholder="请填写" v-model="form.totalFreight"></el-input>
                </el-form-item>
                <p>付款方式</p>
                <el-divider></el-divider>
                <el-form-item label="现付">
                    <el-input placeholder="请填写" v-model="form.cashOnDelivery"></el-input>
                </el-form-item>
                <el-form-item label="预付">
                    <el-input placeholder="请填写" v-model="form.prepaid"></el-input>
                </el-form-item>
                <el-form-item label="到付">
                    <el-input placeholder="请填写" v-model="form.collectOnDelivery"></el-input>
                </el-form-item>
                <el-form-item label="周期付">
                    <el-input placeholder="请填写" v-model="form.periodicPayment"></el-input>
                </el-form-item>
                <el-form-item label="付费合计">
                    <el-input placeholder="请填写" v-model="form.totalPayment"></el-input>
                </el-form-item>
                <p>其他信息</p>
                <el-divider></el-divider>
                <el-form-item label="计划发车时间">
                    <el-date-picker type="datetime" value-format="yyyy-MM-dd HH:mm:ss" placeholder="选择日期"
                        v-model="form.plannedDepartureTime" style="width: 100%;"></el-date-picker>
                </el-form-item>
                <el-form-item label="实际发车时间">
                    <el-date-picker type="datetime" value-format="yyyy-MM-dd HH:mm:ss" placeholder="选择日期"
                        v-model="form.actualDepartureTime" style="width: 100%;"></el-date-picker>
                </el-form-item>
                <el-form-item label="计划到达时间">
                    <el-date-picker type="datetime" value-format="yyyy-MM-dd HH:mm:ss" placeholder="选择日期"
                        v-model="form.plannedArrivalTime" style="width: 100%;"></el-date-picker>
                </el-form-item>
                <el-form-item label="实际到达时间">
                    <el-date-picker type="datetime" value-format="yyyy-MM-dd HH:mm:ss" placeholder="选择日期"
                        v-model="form.actualArrivalTime" style="width: 100%;"></el-date-picker>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false">取 消</el-button>
                <el-button type="primary" @click="toUpdate()">确 定</el-button>
            </div>
        </el-dialog>
        <el-dialog :title="form2.id == null ? '详情' : '详情'" :visible.sync="dialogTableVisible" width="60%">
            <el-form :model="form2">
                <el-descriptions title="基础信息">
                    <el-descriptions-item label="运单状态">{{ form2.status }}</el-descriptions-item>
                    <el-descriptions-item label="运单号">{{ form2.waybillId }}</el-descriptions-item>
                    <el-descriptions-item label="运输方式">{{ form2.transportMode }}</el-descriptions-item>
                    <el-descriptions-item label="始发地">{{ form2.origin }}</el-descriptions-item>
                    <el-descriptions-item label="目的地">{{ form2.destination }} </el-descriptions-item>
                    <el-descriptions-item label="下单日期">{{ form2.placementTime }} </el-descriptions-item>
                    <el-descriptions-item label="创建人">{{ form2.creator }} </el-descriptions-item>
                    <el-descriptions-item label="创建时间">{{ form2.creationTime }} </el-descriptions-item>
                    <el-descriptions-item label="最后更新人">{{ form2.lastUpdatedBy }} </el-descriptions-item>
                    <el-descriptions-item label="最后更新时间">{{ form2.lastUpdateTime }} </el-descriptions-item>
                </el-descriptions>
                <el-descriptions title="承运商">
                    <el-descriptions-item label="承运商名称">{{ form2.carrier }}</el-descriptions-item>
                    <el-descriptions-item label="联系人姓名">{{ form2.carrierContactName }}</el-descriptions-item>
                    <el-descriptions-item label="手机号码">{{ form2.carrierContactPhone }}</el-descriptions-item>
                    <el-descriptions-item label="司机姓名">{{ form2.driverName }}</el-descriptions-item>
                    <el-descriptions-item label="手机号码">{{ form2.driverPhone }} </el-descriptions-item>
                    <el-descriptions-item label="车牌号">{{ form2.licensePlate }} </el-descriptions-item>
                    <el-descriptions-item label="车型">{{ form2.vehicleModel }} </el-descriptions-item>
                    <el-descriptions-item label="车长">{{ form2.vehicleLength }} </el-descriptions-item>
                </el-descriptions>
                <el-descriptions title="货物信息" direction="vertical" :column="11" border>
                    <el-descriptions-item label="id">{{ form2.id }}</el-descriptions-item>
                    <el-descriptions-item label="订单编号">{{ form2.waybillId }}</el-descriptions-item>
                    <el-descriptions-item label="始发地">{{ form2.origin }}</el-descriptions-item>
                    <el-descriptions-item label="目的地">{{ form2.destination }}</el-descriptions-item>
                    <el-descriptions-item label="货物名称">{{ form2.cargoName }} </el-descriptions-item>
                    <el-descriptions-item label="数量">{{ form2.quantity }} </el-descriptions-item>
                    <el-descriptions-item label="体积（m3）">{{ form2.volume }} </el-descriptions-item>
                    <el-descriptions-item label="重量（kg）">{{ form2.weight }} </el-descriptions-item>
                    <el-descriptions-item label="分摊运费（元）">{{ form2.sharedFreight }} </el-descriptions-item>
                    <el-descriptions-item label="装卸费（元）">{{ form2.loadingUnloadingFee }} </el-descriptions-item>
                    <el-descriptions-item label="包装费（元）">{{ form2.packagingFee }} </el-descriptions-item>
                </el-descriptions>
                <el-descriptions>
                    <el-descriptions-item label="总数量">{{ form2.totalQuantity }}</el-descriptions-item>
                    <el-descriptions-item label="总体积">{{ form2.totalVolume }}</el-descriptions-item>
                    <el-descriptions-item label="总重量">{{ form2.totalWeight }}</el-descriptions-item>
                    <el-descriptions-item label="计费方式">{{ form2.billingMethod }}</el-descriptions-item>
                    <el-descriptions-item label="运费成本">{{ form2.freightCost }} </el-descriptions-item>
                    <el-descriptions-item label="装卸费">{{ form2.loadingUnloadingFee }} </el-descriptions-item>
                    <el-descriptions-item label="包装费">{{ form2.packagingFee }} </el-descriptions-item>
                    <el-descriptions-item label="其他费用">{{ form2.otherFees }} </el-descriptions-item>
                    <el-descriptions-item label="运费合计">{{ form2.totalFreight }} </el-descriptions-item>
                </el-descriptions>
                <el-descriptions title="付款方式">
                    <el-descriptions-item label="现付">{{ form2.cashOnDelivery }}</el-descriptions-item>
                    <el-descriptions-item label="预付">{{ form2.prepaid }}</el-descriptions-item>
                    <el-descriptions-item label="到付">{{ form2.collectOnDelivery }}</el-descriptions-item>
                    <el-descriptions-item label="周期付">{{ form2.periodicPayment }}</el-descriptions-item>
                    <el-descriptions-item label="付费合计">{{ form2.totalPayment }} </el-descriptions-item>
                </el-descriptions>
                <el-descriptions title="其他信息">
                    <el-descriptions-item label="现付">{{ form2.cashOnDelivery }}</el-descriptions-item>
                    <el-descriptions-item label="预付">{{ form2.prepaid }}</el-descriptions-item>
                    <el-descriptions-item label="到付">{{ form2.collectOnDelivery }}</el-descriptions-item>
                    <el-descriptions-item label="周期付">{{ form2.periodicPayment }}</el-descriptions-item>
                    <el-descriptions-item label="实际到达时间">{{ form2.actualArrivalTime }} </el-descriptions-item>
                    <el-descriptions-item label="计划发车时间">{{ form2.plannedDepartureTime }} </el-descriptions-item>
                    <el-descriptions-item label="实际发车时间">{{ form2.actualDepartureTime }} </el-descriptions-item>
                    <el-descriptions-item label="计划到达时间">{{ form2.plannedArrivalTime }} </el-descriptions-item>
                </el-descriptions>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogTableVisible = false"> 返回 </el-button>
                <el-button type="primary" @click="toEdit()"> 编辑 </el-button>
                <el-button type="primary" @click="toAddOrUpdate()"> 导出 </el-button>
                <el-button type="primary" @click="toAddOrUpdate()"> 打印 </el-button>
                <el-button @click="toRetern()" type="primary">取消调度</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
import axios from 'axios';

import {
    provinceAndCityData,
    regionData,
    pcTextArr,
    provinceAndCityDataPlus,
    regionDataPlus,
    CodeToText,
    TextToCode,
    codeToText,
    pcaTextArr
} from 'element-china-area-data'
export default {
    data() {
        return {
            pcaTextArr: pcaTextArr,
            options: [],
            originSelected: [], // 独立绑定始发地
            destinationSelected: [], // 独立绑定目的地
            ruleForm: {
                origin: '',
                destination: '',
                status: '',
                transportMode: '',
                waybillId: '',
            },
            tableData: [],
            multipleSelection: [],
            // options: [],
            pageNum: 1,
            pageSize: 10,
            total: 0,
            ShippingMethods: [],
            Vehicle: [],
            Driver: [],
            Carrier: [],
            ruleForm: {},
            form: {},
            dialogFormVisible: false,
            rules: {
                origin: [
                    { required: true, message: '请输入始发地', trigger: 'blur' },
                ],
                destination: [
                    { required: true, message: '请输入目的地', trigger: 'blur' },
                ],
                carrier: [
                    { required: true, message: '请输入承运商名称', trigger: 'blur' },
                ],
                billingMethod: [
                    { required: true, message: '请输入计费方式', trigger: 'blur' },
                ],
                totalPayment: [
                    { required: true, message: '请输入付费合计', trigger: 'blur' },
                ],
                totalFreight: [
                    { required: true, message: '请输入运费合计', trigger: 'blur' },
                ],
            },
            dialogTableVisible: false,
            form2: {},
        };
    },
    methods: {
        handleOriginChange(val) {
            // 将级联选择的数组值转换为字符串（如：["省", "市", "区"] -> "省/市/区"）
            this.originSelected = val;
            this.ruleForm.origin = val ? val.join('/') : '';
            // this.ruleForm.origin = val ? this.convertCodesToText(val) : '';
        },
        handleDestinationChange(val) {
            this.destinationSelected = val;
            this.ruleForm.destination = val ? val.join('/') : '';
            // this.ruleForm.destination = val ? this.convertCodesToText(val) : '';
        },
        exportExcel() {
            const url = '/api/om/waybill/exportExcel';
            window.location.href = url;
        },
        toRetern(id) {
            this.$confirm("确定取消当前调度操作吗?", "操作确认", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            })
                .then(() => {
                    axios.post("/api/om/waybill/toRetern", { id: id })
                        .then((res) => {
                            this.$message({
                                type: "success",
                                message: "取消成功!",
                            });
                            this.getAll();
                        });
                })
                .catch(() => {
                    this.$message({
                        type: "info",
                        message: "取消失败",
                    });
                });
        },
        toEdit() {
            this.form = JSON.parse(JSON.stringify(this.form2));
            this.dialogFormVisible = true;
            this.dialogTableVisible = false;
        },
        toXiangQing(row) {
            axios.post("/api/om/waybill/XiangQing", this.form2,).then((res) => {
                this.form2 = JSON.parse(JSON.stringify(row));
                this.dialogTableVisible = true;
            });
        },
        handleDialogOriginChange(val) {
            this.form.origin = val.join('/')
        },
        handleDialogDestinationChange(val) {
            this.form.destination = val.join('/')
        },
        Update(row) {
            this.form = {
                ...row,
                origin: row.origin ? row.origin.split('/') : [],
                destination: row.destination ? row.destination.split('/') : []
            }
            this.dialogFormVisible = true
        },
        // Update(row) {
        //     this.form = JSON.parse(JSON.stringify(row));
        //     this.dialogFormVisible = true;
        // },
        toUpdate() {
            axios.post('/api/om/waybill/Update', this.form).then((res) => {
                if (res.data.code === 200) {
                    this.$message({
                        type: 'success',
                        message: res.data.message,
                    });
                    this.getAll();
                    this.dialogFormVisible = false;
                } else {
                    this.message({
                        type: 'warning',
                        message: res.data.message,
                    });
                }
            });
        },
        handleSelectionChange(val) {
            this.multipleSelection = val;
        },
        resetForm() {
            this.ruleForm = {};
            this.getAll();
        },
        getAll() {
            axios.post(`/api/om/waybill/getAll?pageNum=${this.pageNum}&pageSize=${this.pageSize}`, this.ruleForm).then((res) => {
                this.tableData = res.data.records;
                this.total = res.data.total;
            });
        },
        handleSizeChange(val) {
            console.log(`每页 val 条`);
            this.pageSize = val;
            this.getAll();
        },
        handleCurrentChange(val) {
            console.log(`每页 val 条`);
            this.pageNum = val;
            this.getAll();
        },
        findShippingMethods() {
            axios.post('/api/om/shipping-methods/findShippingMethods').then((res) => {
                this.ShippingMethods = res.data;
            }).catch((err) => {
                console.log(err);
                this.$message.error('请求出错: ' + err.message);
            });
        },
        findVehicle() {
            axios.post('/api/om/vehicle/findVehicle').then((res) => {
                this.Vehicle = res.data;
            }).catch((err) => {
                console.log(err);
                this.$message.error('请求出错: ' + err.message);
            });
        },
        findDriver() {
            axios.post('/api/om/driver/findDriver').then((res) => {
                this.Driver = res.data;
            }).catch((err) => {
                console.log(err);
                this.$message.error('请求出错: ' + err.message);
            });
        },
        findCarrier() {
            axios.post('/api/om/carrier/findCarrier').then((res) => {
                this.Carrier = res.data;
            }).catch((err) => {
                console.log(err);
                this.$message.error('请求出错: ' + err.message);
            });
        },
    },
    created() {
        this.getAll();
        this.findShippingMethods();
        this.findVehicle();
        this.findDriver();
        this.findCarrier();
    },
}
</script>
<style scoped>
.waybill-search-container {
    padding: 20px;
    background-color: #f9f9f9;
    border: 1px solid #e4e7ed;
    border-radius: 4px;
}

.operation-buttons {
    margin-bottom: 10px;
}

.line {
    text-align: center;
}
</style>